<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <script type="text/javascript" src="./script/rem.js"></script>
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/font-awesome.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    <script type="text/javascript" src="./script/aui-slide.js"></script>
    <script type="text/javascript" src="./script/jquery.min.js"></script>
    <script type="text/javascript" src="./script/doT.min.js"></script>
    <script type="text/javascript" src="./script/base.js"></script>
    <script type="text/javascript" src="./script/api.js"></script></head>
    <script type="text/javascript" src="./script/aui-tab.js" ></script>
    <script type="text/javascript" src="./script/jquery-3.2.0.js"></script>
</head>
<body>

    <header class="head" style="padding-top:0.4rem;">
        <div class="head-l" tapmode onclick="closeWin();"><i class="fa fa-angle-left"></i></div>
        <h3>订单详情</h3>
        <div class="head-r"></div>
    </header>
    <div class="head-d" style="padding-top:0.4rem;"></div>
    <div id="list">
<!--         <dl class="order-t mb20">
            <dt>订单号：123456789056789<span>交易完成</span></dt>
            <dd>订单日期：2016-10-22   10:28</dd> 
        </dl> -->

        <!-- 地址 -->
        <!-- <div class="order-address" tapmode onclick="address()"> -->
        <!-- <img src="image/address-icon.png"> -->
<!--             <dl>
                <dt>张华<span>15487878728</span></dt>
                <dd>辽宁省沈阳市铁西区建设大路建设东路57号1202室</dd>
            </dl> -->
            <!-- <p>添加收货地址</p> -->
            <!-- <i class="fa fa-chevron-right"></i> -->
<!--         </div>
    <div class="order-address-d mb20"></div> -->

    <!-- 商品 -->
<!--         <div class="shop-order-goods mb20">
            <h3>选购商品</h3>
            <ul>
                <li>
                    <img src="image/classify.jpg">
                    <dl>
                        <dt>澳大利亚·毛孔脏东西浮出来·麦卢...</dt>
                        <p>规格：套装</p>
                        <dd>
                            ￥166.00
                            <span>x3</span>
                        </dd>
                    </dl>
                </li>
                <li>
                    <img src="image/classify.jpg">
                    <dl>
                        <dt>澳大利亚·毛孔脏东西浮出来·麦卢...</dt>
                        <p>规格：套装</p>
                        <dd>
                            ￥166.00
                            <span>x3</span>
                        </dd>
                    </dl>
                </li>
            </ul>
            <div class="shop-order-goods-m">
                <span>共20件</span>
                合计￥2301.00
            </div>
            <div class="shop-order-goods-m-d">
                含运费：11.00
            </div>
        </div>


        <div class="cart-d-t"></div>
        <div class="cart-d">
            <div class="cart-d-l">
                <p>合计：<span>￥888.00</span></p>
            </div>    
            <div class="cart-d-r" tapmode onclick="shop_order_pay()">提交订单</div>    
        </div> -->
    </div>
</body>
<script type="text/javascript" src="./script/api.js"></script>
<script type="text/javascript" src="./script/index.js"></script>
<script type="text/template" id="template">
    {{? it.category == 1}}
    <div class="order-t-t">【商城商品】</div>
    {{??}}
    <div class="order-t-t">【当月商品】</div>
    {{?}}
    <dl class="order-t mb20">
        <dt>订单号：{{=it.pay_number}}<span>{{=it.action.status_str}}</span></dt>
        <dd>订单日期：{{=it.create_time}}</dd> 
    </dl>

    <!-- 地址 -->
    <div class="order-address" tapmode onclick="address()">
        <dl>
            <dt>{{=it.address.name}}<span>{{=it.address.phone}}</span></dt>
            <dd>{{=it.address.district[0].title}}{{=it.address.district[1].title}}{{=it.address.district[2].title}}{{=it.address.address}}</dd>
        </dl>
    </div>
    <div class="order-address-d mb20"></div>

    <!-- 商品 -->
    <div class="shop-order-goods mb20">
        <h3>选购商品</h3>
        <ul>
            {{~it.cart:value:index}}
            <li>
                <img src="{{=value.product.image}}">
                <dl>
                    <dt>{{=value.product.title}}</dt>
                    <p>规格：{{=value.product.unit_title}}</p>
                    <dd>
                        ￥{{=value.price}}
                        <span>x{{=value.number}}</span>
                    </dd>
                </dl>
            </li>
            {{~}}
        </ul>
        <div class="shop-order-goods-m">
            <p>
                <span>共{{=it.product_number}}件</span>
                <!-- 合计￥{{=it.price_product}} -->
                合计{{? it.category == 1}}
                <i>{{=it.price_total}}赚石</i>
                {{??}}
                {{? it.pay_method == 1}}
                <i>{{=it.price_total}}赚石</i>
                {{??}}
                <i>{{=it.price_icon}}金币</i>
                {{?}}
                {{?}}
            </p>
            <!--             <i>{{=it.price_icon}}金币</i> -->
        </div>
<!--         <div class="shop-order-goods-m-d">
            含运费：11.00
        </div> -->
    </div>




    <div class="cart-d-t"></div>
    <div class="order-details-d">
        <div class="order-details-d-l">
            <p>合计：<span>￥{{=it.price_total}}</span></p>
        </div>
        <div class="order-details-d-r">
            {{~it.action.action:valueee:indexxx}}
            {{? valueee == "1"}}
            <span onclick="payfor({{=it.price_total}})">付款</span>
            {{?? valueee == "2"}}
            <span  onclick="service('{{=it.id}}','{{=it.pay_number}}');">换货</span>
            {{?? valueee == "4"}}
            <span onclick="logistics('{{=it.post_url}}');">查看物流</span>
            {{?? valueee == "5"}}
            <span>评价</span>
            {{?? valueee == "7"}}
            <span onclick="handleOrder({{=it.id}},'delete');">删除订单</span>
            {{?? valueee == "8"}}
            <span onclick="handleOrder({{=it.id}},'cancel');">取消订单</span>
            {{?? valueee == "9"}}
            <span onclick="handleOrder({{=it.id}},'receive');">确认收货</span>
            {{?}}
            {{~}}
        </div>  
    </div>

</script>
<script type="text/javascript">

    apiready = function(){
        id = api.pageParam.id;
        loadData(id);
        // reloadListener(); 
    }

    function loadData(id){
        var token = $api.getStorage('token');
        api.ajax({
            url: webAddress + '/api/order/'+id+'/show',
            method: 'get',
            data: {
                values: {
                    id:id
                },
            },
            headers: {
                Authorization: 'Bearer ' + token,
                Accept: 'application/json',
            },
        },function(ret, err){
            if (ret) {
                // alert( JSON.stringify( ret ) );
                ret.data.action.action = ret.data.action.action.split(',');
                templateFun(ret.data);
            } else {
                // alert( JSON.stringify( err ) );
                api.toast({
                    msg: err.body.message,
                    duration: 2000,
                    location: 'bottom'
                });
                return false;
            }
        });
    }

    // 模板赋值函数
    function templateFun(data){
      var template = $api.byId('template');
      var dotFn = doT.template(template.innerHTML);
      var html = dotFn(data);
      var list = $api.byId('list');
      $api.html(list, html);
  }

    // 处理订单
    function handleOrder(id,action){

        var msg = '';
        if (action == 'delete') {
            msg = '是否删除订单?';
        }else if(action == 'cancel'){
            msg = '是否取消订单?';
        }else if(action == 'receive'){
            msg = '是否确认收货?';
        }

        api.confirm({
            title: '提示!',
            msg: msg,
            buttons: ['确定', '取消']
        }, function(ret, err){
            if( ret ){
             // alert( JSON.stringify( ret ) );
             if (ret.buttonIndex == 1) {
                var token = $api.getStorage('token');
                api.ajax({
                    url: webAddress + '/api/order/'+id+'/'+action,
                    method: 'get',
                    data: {
                        values: {
                            id:id
                        },
                    },
                    headers: {
                        Authorization: 'Bearer ' + token,
                        Accept: 'application/json',
                    },
                },function(ret, err){
                    if (ret) {
                        // alert( JSON.stringify( ret ) );
                        if (ret.status_code == 200) {
                            api.toast({
                                msg: ret.message,
                                duration: 2000,
                                location: 'bottom'
                            });
                            loadData(id);
                        }
                    } else {
                        // alert( JSON.stringify( err ) );
                        api.toast({
                            msg: err.body.message,
                            duration: 2000,
                            location: 'bottom'
                        });
                        return false;
                    }
                });
            }
        }else{
             // alert( JSON.stringify( err ) );
             api.toast({
                msg: err.body.message,
                duration: 2000,
                location: 'bottom'
            });
             return false;
         }
     });

    }

    // 查看物流
    function logistics(post_url){
        api.openWin({
            name: 'logistics',
            url: './web_view.html',
            pageParam: {
                url: post_url,
                title: '查看物流',
            }
        });
    }

    // 换货
    function service(order_id,pay_number){
        api.openWin({
            name: 'replacement',
            url: './replacement.html',
            pageParam: {
                order_id: order_id,
                pay_number: pay_number,
            }
        });
    }

    // 监听事件 (页面刷新)
    function reloadListener(){
        api.addEventListener({
            name: 'reload',
        }, function(ret, err){
            loadData(id);
        });
    }

    function shop_order_pay() {
        api.openWin({
            name: 'shop_order_pay',
            url: './shop_order_pay.html',
        });
    }
    function address() {
        api.openWin({
            name: 'address',
            url: './address.html',
        });
    }
    function closeWin(){
        api.sendEvent({
          name: 'reload'
      });
        api.closeWin({
        });
    }

    function payfor(price){
        api.openWin({
            name: 'shop_order_pay_password',
            url: './shop_order_pay_password.html',
            pageParam: {
                order_id: id,
                price: price
            }
        });
    }
</script>
</html>